import { VAR } from "../introduce.js"

window.onload = function () {
	/// 先渲染

	// 提取数据
	const taskInfo = JSON.parse(localStorage.getItem("deliveryInfo"))
	const index = new URLSearchParams(location.search).get("id") || 0

	// 任务编号
	const accounts = document.querySelector(".essential span")
	// 起始地点
	const go = document.querySelector(".essential .hideEssential .go p")
	// 重终点
	const to = document.querySelector(".essential .hideEssential .to p")
	// 司机电话发货期等
	const drivephone = document.querySelector(
		".essential .hideEssential .text .phone"
	)
	const drivetimego = document.querySelector(
		".essential .hideEssential .text .timego"
	)
	const drivetimeto = document.querySelector(
		".essential .hideEssential .text .timeto"
	)
	const drivename = document.querySelector(
		".essential .hideEssential .text .name"
	)
	// 车辆司机信息
	const driverName = document.querySelector(".driver .uname")
	const drivernumber = document.querySelector(".driver .num")
	// 车辆信息
	// 货物信息
	// 渲染运输路线
	const roteGo = document.querySelector(".transRoutes .find .go div")
	const rotego = document.querySelector(".transRoutes .find .go p")
	const roteTo = document.querySelector(".transRoutes .find .destination div")
	const roteto = document.querySelector(".transRoutes .find .destination p")
	// 渲染数据
	// 提取数据

	function render() {
		// 封装渲染函数
		// 任务编号;
		accounts.innerHTML = `(任务编号:${taskInfo[index].taskNumber})`
		// 地点
		go.innerHTML = taskInfo[index].actualAddress
		to.innerHTML = taskInfo[index].deliveryAddress
		// 司机电话发货期等
		drivephone.innerText = taskInfo[index].phone
		drivetimego.innerHTML = taskInfo[index].pickupTime
		drivetimeto.innerHTML = taskInfo[index].estimatedDeliveryTime
		drivename.innerHTML = taskInfo[index].contactPerson
		// 车辆司机信息;
		driverName.innerHTML = taskInfo[index].contactPerson
		// 车牌号
		drivernumber.innerHTML = taskInfo[index].carNumber
		//运输路线
		// 货物信息
		// 提货信息
	}
	render()
	// 页面后退一步实现
	const back = document.querySelector(".topPreset a")
	back.addEventListener("click", function () {
		history.back()
	})
	// 任务编号
	const taskNum = document.querySelector(".essential .wrapper .info span")
	// 基本信息展开按钮
	const taskNumUnfold = taskNum.nextElementSibling
	// 折叠层
	const hideEssential = document.querySelector(".hideEssential")
	let flag1 = false
	taskNumUnfold.addEventListener("click", function () {
		flag1 = !flag1
		if (flag1) {
			hideEssential.style.display = "block"
			taskNumUnfold.innerHTML = "-"
		} else {
			hideEssential.style.display = "none"
			taskNumUnfold.innerHTML = "+"
		}
	})
	// 车辆司机信息
	const driverNumUnfold = document.querySelector(".driver .wrapper #fold")
	const hideDrive = document.querySelector(".hideDrive")
	let flag2 = false
	driverNumUnfold.addEventListener("click", function () {
		flag2 = !flag2
		if (flag2) {
			hideDrive.style.display = "block"
			driverNumUnfold.innerHTML = "-"
		} else {
			hideDrive.style.display = "none"
			driverNumUnfold.innerHTML = "+"
		}
	})

	// 运输路线
	const transRoutes = document.querySelector(".transRoutes .wrapper #fold")
	const findtransRoutes = document.querySelector(".transRoutes .find")
	let flag3 = false
	transRoutes.addEventListener("click", function () {
		flag3 = !flag3
		if (flag3) {
			findtransRoutes.style.display = "block"
			transRoutes.innerHTML = "-"
		} else {
			findtransRoutes.style.display = "none"
			transRoutes.innerHTML = "+"
		}
	})

	// 货物信息
	const goodsInfo = document.querySelector(".goodsInfo .wrapper #unfold")
	const hidegoods = document.querySelector(".hidegoods")
	let flag4 = false
	goodsInfo.addEventListener("click", function () {
		flag4 = !flag4
		if (flag4) {
			hidegoods.style.display = "block"
			goodsInfo.innerHTML = "-"
		} else {
			hidegoods.style.display = "none"
			goodsInfo.innerHTML = "+"
		}
	})

	// 提货信息
	const Delivery = document.querySelector(".Delivery .wrapper #fold")
	const hidedeli = document.querySelector(".hidedeli")
	let flag5 = false
	Delivery.addEventListener("click", function () {
		flag5 = !flag5
		if (flag5) {
			hidedeli.style.display = "block"
			Delivery.innerHTML = "-"
			// console.log(Delivery);
		} else {
			hidedeli.style.display = "none"
			Delivery.innerHTML = "+"
			console.log(Delivery.style.backgroundImage)
		}
	})

	//动态搜索
	const search = document.querySelector(
		".goodsInfo .wrapper .hidegoods .serch input"
	)
	const textSpan = document.querySelectorAll(
		".goodsInfo .wrapper .hidegoods ul li .textt"
	)
	search.addEventListener("input", function () {
		textSpan.forEach(function (item, index) {
			item.innerText.includes(search.value)
				? (item.parentNode.style.display = "block")
				: (item.parentNode.style.display = "none")
		})
	})
	// 提交按钮
	// 回单图片和货品照片都上传时启用按钮
	const firm = document.querySelector(".firm")
	const imgs = document.querySelector(".imgs")
	firm.addEventListener("click", function () {
		// console.log(111);
		// var wsh = new ActiveXObject("wscript.shell");
		// listall(wash.SpecialFolders("Desktop"));
	})
	imgs.addEventListener("click", function () {
		var wsh = new ActiveXObject("wscript.shell")
		listall(wsh.SpecialFolders("Desktop"))
	})

	// 延迟与提交
	// 文字显示
	const floatingTips = document.querySelector(".floatingTips")
	const delayBtn = document.querySelector(".delay .delayBtn")
	const delivery = document.querySelector(".delay .delivery")
	delayBtn.addEventListener("touchstart", function () {
		// console.log(111);
		delayBtn.disabled = true
		delayBtn.classList.add("active2")

		//延迟提货
		// 延迟提货按钮按下修改本地存储的状态值
		taskInfo[index].isDelay = true
		floatingTips.style.opacity = "1"
		setTimeout(function () {
			location.href = `../module03/HTML/Delayed-pickup.html?id=${index}`
		}, 2000)
		localStorage.setItem("deliveryInfo", JSON.stringify(taskInfo))
		// localStorage.setItem("")
	})
	delivery.addEventListener("touchstart", function () {
		delivery.disabled = true
		delivery.classList.add("active1")
		// 提货传参 数据上传
		//提货
		taskInfo[index].Status = "1"
		localStorage.setItem("deliveryInfo", JSON.stringify(taskInfo))
		floatingTips.style.opacity = "1"
		setTimeout(function () {
			location.href = "../module04/mainFunctionPage.html"
		}, 2000)
	})
	// 点击加载图片上传图片
	const ul1 = document.querySelector(".voucher ul")
	const ul2 = document.querySelector(".goodsImag ul")
	const btnfirn = document.querySelector(".voucher .firm")
	const btnimgs = document.querySelector(".goodsImag .imgs")
	btnfirn.addEventListener("click", function () {
		// renderImg(ul1);
		setTimeout(renderImg(ul1), 15000)
		// renderImg(ul2);
	})
	btnimgs.addEventListener("click", function () {
		setTimeout(renderImg(ul2), 10000)
		// renderImg(ul2);
	})
	function renderImg(ul) {
		//取到n~m的随机整数
		function getRandom(n, m) {
			return Math.floor(Math.random() * (m - n + 1)) + n
		}
		//调用
		let random = getRandom(1, 3)

		const li = document.createElement("li")
		li.innerHTML = `
    <li><img src="./image/收据${random}.png" alt>
    </li>`
		ul.append(li)
	}
}
